<div class="Report-Statistics">

    <div class="Report-Statistics-top">
        <div *ngIf="!ChartsHide" echarts [options]="countOptions" id="ReportList" style="width: 133px;height: 133px;margin: 48px auto 40px auto;"></div>
        <div class="ChartsHide" *ngIf="ChartsHide"></div>
        <div class="timeChoose">
            <input [ngClass]="{ 'slide-up': TimeBoolean[0] }" type="text" readonly="readonly" [(ngModel)]="timeOver[0]" (click)="ListShow(0)">
            <ul class="Day0">
                <li [ngClass]="{ 'active': i === ItemIndex[0] }" *ngFor="let x of TimeItem, let i = index" (click)="ItemTimeSelect(0,i)">{{x}}</li>
            </ul>
        </div>
        <div class="Report-list">
            <div>
                <ul>
                    <li><span>严重警告</span>
                        <p>{{ AlarmCount.serious.alarmCount || 0 }}</p>
                    </li>
                    <li><span>已响应<i style="font-size: 9px;color: #777">&nbsp;(个)</i></span>
                        <p>{{ AlarmCount.serious.responseCount || 0 }}</p>
                    </li>
                </ul>
            </div>
            <div>
                <ul>
                    <li><span>一般警告</span>
                        <p>{{ AlarmCount.general.alarmCount || 0 }}</p>
                    </li>
                    <li><span>已响应<i style="font-size: 9px;color: #777">&nbsp;(个)</i></span>
                        <p>{{ AlarmCount.general.responseCount || 0 }}</p>
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <div class="Report-line"></div>

    <div class="Report-Statistics-bottom">
        <div>
            <h3 style="float: left;">告警类别</h3>
            <i style="float: left;font-size: 9px;color: #777;margin-top: 1px">&nbsp;(个)</i><span style="padding-top: 4px;display: block;">&nbsp;&nbsp;&nbsp;<img src="assets/imgs/gallery/SVG/17188.svg" alt="">TOP5</span>
            <div class="timeChoose">
                <input [ngClass]="{ 'slide-up': TimeBoolean[1] }" type="text" readonly="readonly" [(ngModel)]="timeOver[1]" (click)="ListShow(1)">
                <ul class="Day1">
                    <li [ngClass]="{ 'active': i === ItemIndex[1] }" *ngFor="let x of TimeItem, let i = index" (click)="ItemTimeSelect(1,i)">{{ x }}</li>
                </ul>
            </div>
        </div>
        <div *ngIf="!ErroHide" echarts [options]="typeOptions" id="ReportType" style="width: 100%;height: 200px;margin: 0 auto;"></div>
        <div *ngIf="ErroHide" style="width: 100%;height: 200px;margin: 0 auto;"></div>
    </div>
</div>